<template>
  <div class="productSelection">
    <div style="margin-top: 15px;"></div>

    <FilterTable
      ref="table"
      height="auto"
      :params="fetchParams"
      :datakey="'rows'"
      :dataSource="listProduct"
      :columns="columns"
      :onColumnsChange="columns => (this.columns = columns)"
      :onSyncTableData="getTableData"
    >
      <template slot="moreActions">
        <span @click="removeRecordHandle">删除数据</span>
      </template>
      <template slot="controls">
        <el-button size="small" type="primary" icon="el-icon-plus" @click="() => this.addRecordHandle()">添加</el-button>
      </template>
    </FilterTable>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDialog">取 消</el-button>
      <el-button type="primary" @click="saveDialog">保 存</el-button>
    </div>
  </div>
</template>

<script>
// 数据字典/按钮权限
import { dictionary } from '@/utils/dictMixin';
import { harnessSave } from '@/api/part/report/harnessInquiry';
export default {
  name: 'productSelection',
  mixins: [dictionary],
  props: {
    modifyType: {
      default: false,
      type: Boolean
    }
  },
  data() {
    return {
      columns: this.createTableColumns(), // table数据
      fetchParams: {},
      listProduct: [],
      selectedRows: [], // 选中列表中的行
      isChoice: true, // 按钮是否可以选择
      tableData: []
    };
  },
  created() {
    this.init();
  },
  selectChange(rows) {
    // 选中时触发的函数
    this.selectedRows = rows;
    this.isChoice = this.selectedRows.length > 0 ? false : true;
  },
  mounted() {
    // 获取 Table 组件对象
    // this.$tableSc = this.$refs.table.$refs.pageTable;
  },
  methods: {
    // 异步获取table数据
    async getTableData(val) {
      this.tableData = val;
    },
    init() {},
    createTopFilters() {
      return [];
    },

    changeHandle(val) {
      this.fetchParams = { ...val };
    },

    closeDialog(param) {
      // 取消
      this.$emit('close', false, param);
    },
    // table 组件新增行
    addRecordHandle() {
      this.$refs.table.EXECUTE_INSERT({});
    },
    removeRecordHandle() {
      this.$refs.table.EXECUTE_DELETE(this.selectedRows);
    },
    formChangeHandle(val) {
      this.saveData = val;
    },
    // 保存
    async saveDialog() {
      let params = [];
      console.log(this.tableData, '数据1  ');
      // 校验是否为空表单
      if (this.tableData.length < 1) {
        return this.$notify.error({ title: '提示信息', message: '不允许提交空表单' });
      }
      // console.log(this.$tableSc.dataSource, '数据');
      const err = await this.$refs.table.GET_REQUIRED_ERROR();
      if (err) {
        return;
      }

      params = _.cloneDeep(this.tableData);
      // console.log(params, 2222);
      // params.forEach(element => {
      //   if (element.XSTYP == '1') {
      //     element.XSTYP = '';
      //   }
      // });
      const res = await harnessSave(params);
      if (res.resultCode == 200) {
        this.$notify.success({ title: '提示信息', message: '保存成功!' });
        this.fetchParams = { ...this.fetchParams };
        // 需要主页面刷新
        this.closeHandler('refresh');
      }
    },
    // 关闭面板
    closeHandler(type) {
      this.$emit('close', false, type);
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },

        {
          title: '底盘号',
          dataIndex: 'SERNR',
          sorter: true,
          filter: true,
          filterType: 'input',
          editable: true,
          editRequired: true
        },
        {
          title: '线束类型',
          dataIndex: 'XSTYP',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          editable: true,
          editRequired: true,
          editType: 'select',
          editItems: [
            // { text: '全部', value: '1' },
            { text: '内饰线束', value: 'N' },
            { text: '仪表线束', value: 'Y' },
            { text: '发动机线束', value: 'F' }
          ]
        },
        {
          title: '经销商备注',
          dataIndex: 'KUREM',
          sorter: true,
          filter: true,
          filterType: 'input',
          editable: true,
          editRequired: true
        }
      ];
    }
  }
};
</script>

<style scoped="scoped" lang="less"></style>
